<template>
    <div class="citylist">
        <div class="active">
            当前选择:{{this.$store.state.city}}
        </div>
        <ul v-for="item in citys">
            <li @click="handleCityClick(item)">{{item}}</li>
        </ul>
        <tabbar></tabbar>
    </div>
</template>

<script>
import tabbar from "@/components/tabbar.vue";
export default {
  name: "citylist",
  data() {
    return {
        citys:["北京","上海","广州","深圳","新疆"]
    };
  },
  components: {
    tabbar
  },
  methods:{
      handleCityClick(city){
alert(city);
this.$store.commit('changeCity',city)
      }
  }
};
</script>


<style scoped>
li {
  list-style: none;
}
</style>


